<template>
    <div>
        <div>
            <input type="number" v-model="phone">
        </div>
        <div>
            <input type="password" v-model="password">
        </div>
        <div>
            <button @click="login">登录</button>
        </div>
    </div>
</template>
<script>
import axios from 'axios'
export default {
    data() {
        return {
            phone: '',
            password: ''
        }
    },
    methods: {
        login() {
            const reg =  /^[0-9a-zA-Z]+$/ // 正则表达式
            if(this.phone.length === 11) { // 手机号11位
                // 判断密码格式
                if(this.psw1 === this.psw2 && reg.test(this.psw1)) { // 密码格式校验完成
                    axios.post('/api/login', {
                        phone: this.phone,
                        password: this.$md5(this.password)
                    }).then(res =>{
                        if (res.data.code === 1) { // 登录成功
                            localStorage.setItem('user', JSON.stringify({
                                phone: this.phone,
                                signinnum: res.data.signinnum
                            }))
                            this.$router.push('/')
                        } else {
                            alert('登录失败')
                        }
                    })
                } else {
                    alert('两次密码输入不一致')
                }
            } else {
                alert('手机号格式错误')
            }
        }
    },
}
</script>